<template>
  <div style="display: inline-block;">
    <el-upload
      :disabled="props.disabled"
      :action="uploadAction"
      :headers="uploadHeaders"
      accept=".xls,.xlsx"
      :data="props.data"
      :on-success="handleUploadSuccess"
      :before-upload="beforeAvatarUpload"
    >
      <el-button icon="el-icon-upload" :type="props.disabled ? 'info' :'primary'">上传</el-button>
    </el-upload>
  </div>
</template>

<script setup>
import $cookie from "vue-cookies";
import { ElMessage } from "element-plus";
const uploadHeaders = { Authorization: $cookie.get("Authorization") };
// const uploadAction = http.adornUrl("/admin/file/upload/element");
const emit = defineEmits(["update:modelValue"]);
// eslint-disable-next-line no-unused-vars
const props = defineProps({
  modelValue: {
    default: "",
    type: String,
  },
  url: {
    default: '/admin/file/upload/element',
    type: String,
  },
  data: {
    type: Object,
    default:() => {
      return {}
    }
  },
  disabled: {
    type: Boolean,
    default: false
  }
});

const uploadAction = computed(() => {
  return http.adornUrl(props.url);
})

const resourcesUrl = import.meta.env.VITE_APP_RESOURCES_URL
//const resourcesUrl = "http://s67sjhrad.hn-bkt.clouddn.com/";

/**
 * 图片上传
 */
// eslint-disable-next-line no-unused-vars
const handleUploadSuccess = (response, file) => {
  emit("update:modelValue", response);
};

/**
 * 限制图片上传大小
 */
const beforeAvatarUpload = (file) => {
  // const isLt2M = file.size / 1024 / 1024 < 2;
  // if (!isLt2M) {
  //   ElMessage.error("上传图片大小不能超过 2MB!");
  // }
  return true;
};
</script>

<style lang="scss" scoped></style>
